<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>订单详情</title>
		<link rel="stylesheet" href="../libs/mui/mui.css" />
		<link rel="stylesheet" href="../libs/iconfont/fonts/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../css/main.css" />
		<!--<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>-->
		<style> 
			/*内容*/
			.marg{margin-top: 5px;}
			.mui-table-view.mui-grid-view{padding: 0;}
			.mui-table-view.mui-grid-view .mui-table-view-cell {text-align: left;padding: 11px 0px 6px 15px;}
			/*收货人*/
			.shouhu{padding: 11px 45px 0px 40px!important;}
			.tub{line-height: 42px;}
			.tub i{font-size: 1.3em;}	
			.mui-input-row label{width: 25%;}	
			.mui-input-row label~span{width: 75%;line-height: 40px;}	 
			/*底部*/
			.mui-bar{line-height: 50px;padding: 0 15px;}			
			.mui-table-view {padding: 5px 0;}			
			.details{color: #AAAAAA;margin-top: 6px;}
			.details li{width: 95%;}
			.details_1{color: #AAAAAA;}
			.details_1 li{width: 95%;}
			
			.total{line-height: 50px;border-top: 1px solid #efeff4;text-align: right;}
			.total button{width: 80px;line-height: 15px;overflow: hidden;padding: 10px 12px 7px!important;}
			.total span:nth-child(2){display: inline-block;float: right;}	
			.mui-table-view.mui-grid-view .mui-table-view-cell .mui-media-object{    border: 1px solid #eee;}
			.num{margin-right: 15px;}
			
			/*支付密码弹窗 start*/
			
			.password-of-pay-wraper {
			  display: none;
			  width: 80%;
			  height: 180px;
			  background-color: #fff;
			  position: fixed;
			  left: 10%;
			  top: 50%;
			  margin-top: -90px;
			  border-radius: 5px;
			  z-index: 1002;
			}
			
			#password_backdrop {
			  position: fixed;
			  z-index: 999;
			  top: 0;
			  right: 0;
			  bottom: 0;
			  left: 0;
			  -webkit-transition-duration: 400ms;
			  -moz-transition-duration: 400ms;
			  transition-duration: 400ms;
			  opacity: 1;
			  -webkit-opacity: 1;
			  -moz-opacity: 1;
			  -khtml-opacity: 1;
			  filter: alpha(opacity=100);
			  background: rgba(0, 0, 0, .4);
			  display: none;
			}
			
			.password-of-pay-top {
			  width: 100%;
			  height: 35px;
			  line-height: 35px;
			  text-align: center;
			  color: #757575;
			  border-bottom: 1px solid #e1e1e1;
			  position: relative;
			}
			
			.password-of-pay-top .close-btn {
			  width: 28px;
			  height: 28px;
			  line-height: 28px;
			  text-align: center;
			  position: absolute;
			  top: 4px;
			  left: 10px;
			  font-size: 16px;
			}
			
			.password-of-pay-body {
			  width: 100%;
			  padding-top: 40px;
			}
			
			.password-of-pay-body form {
			  width: 210px;
			  background-color: #f30;
			  margin: 0 auto;
			  position: relative;
			}
			
			.password-of-pay-body input[type="password"] {
			  float: left;
			  width: 35px;
			  height: 35px;
			  line-height: 35px;
			  text-align: center;
			  font-size: 24px;
			  padding: 0;
			  margin: 0;
			  border-radius: 0;
			}
			
			.password-of-pay-body form input[type="password"]+ input[type="password"] {
			  border-left: 0;
			}
			
			
			/*支付密码弹窗 end*/ 
		</style>
	</head>
	<body>
		<!--头部导航-->
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">订单详情</h1>			
		</header>
		<!--底部导航-->
		<nav class="mui-bar mui-bar-tab">
			<div class="mui-col-xs-5 mui-pull-left xiangq">
				<span>合计：￥<map></map></span>							
			</div>
			<div class="mui-col-xs-7 total mui-pull-right">
				<div class="state_desc">
					<!--<button type="button" class="mui-btn">取消订单</button>
					<button type="button" class="mui-btn RGB">确认收货</button>-->
				</div>	
			</div>
			
		</nav>
		<!--中间导航-->
		<div class="mui-content">
			<div class="data" ng-repeat="xs in set">
				<ul class="mui-table-view">
					<li class="mui-table-view-cell">
						<div class="mui-col-xs-11">
							<span>
								<i class="iconfont">&#xe622;</i>
								订单编号：<span class="order_sn"></span>
							</span>							
						</div>					
					</li>	
				</ul>
			</div>
			<div class="Submit" ng-repeat="xs in set">
				<ul class="mui-table-view mui-grid-view">
					<li class="mui-table-view-cell mui-col-xs-12 shouhu">
						<span></span>
						<span class="mui-pull-right"></span>
					</li>
					<li class="mui-table-view-cell">													
						<div class="mui-col-xs-10">								
							<div class="mui-col-xs-1 mui-pull-left tub"><i class="iconfont">&#xe61e;</i></div>
							<div class="mui-ellipsis-2 back mui-h5">收货地址：<span class="reciver_addr"></span></div>
						</div>
					</li>					
				</ul>
			</div>	
			<div class="shopping m5">
				<div class="order_goods">
					<!--循环开始-->
					<!--<ul class="mui-table-view mui-grid-view" ng-repeat="x in rs">
						<li class="mui-table-view-cell mui-col-xs-3">
							<img class="mui-media-object mui-pull-left" src="{{x.image_url}}"/>
						</li>
						<li class="mui-table-view-cell mui-col-xs-9">
							<div class="mui-ellipsis-2 title">{{x.goods_name}}</div>										
							<div class="money">
								<span>￥{{x.goods_price}}</span><span class="mui-pull-right num">x{{x.goods_num}}</span>
							</div>
						</li>	
						<div class="details_1">-->
							<!--<li class="mui-table-view-cell">
								<span>数量</span>
								<span class="mui-pull-right">x1</span>
							</li>-->
							<!--<li class="mui-table-view-cell">
								<span>类型</span>
								<span class="mui-pull-right ">{{x.goods_spec}}</span>
							</li>
						</div>
					</ul>-->
					<!--循环结束-->
				</div>
				<ul class="mui-table-view mui-grid-view details">
					<li class="mui-table-view-cell" style="padding: 0;">						
						<div class="mui-input-row">
							<label>备注：</label>
							<span class="order_message"></span>														
						</div>
					</li>
				</ul>
			</div>			
		</div>
		<!--/*支付密码弹窗 start*/-->
			<div class="password-of-pay-wraper" id="j_password_of_pay">
				<div class="password-of-pay-top">
					<p>请输入支付密码</p>
					<div class="close-btn" id="j_close_tn">X</div>
				</div>
				<div class="password-of-pay-body">
					<form action="#" class="mui-clearfix">
						<input type="password" id="pwd1" maxlength="1" />
						<input type="password" id="pwd2" maxlength="1" />
						<input type="password" id="pwd3" maxlength="1" />
						<input type="password" id="pwd4" maxlength="1" />
						<input type="password" id="pwd5" maxlength="1" />
						<input type="password" id="pwd6" maxlength="1" />
					</form>		
				</div>
			</div>
			<div id="password_backdrop"></div>
	</body>
	<script type="text/javascript" src="../libs/jquery/jquery.js"></script>
	<script type="text/javascript" src="../js/mui.min.js"></script>
	<script type="text/javascript" src="../js/open.js"></script>
	<script src="../js/appconfig.js"></script>
	<script type="text/javascript" src="../js/web_js/public.js"></script>
	<script type="text/javascript" src="../js/web_js/order_goods.js"></script> 
	<script type="text/javascript" src="../js/web_js/order_pay.js"></script> 
	<script type="text/javascript" charset="utf-8"> 
		mui.init();
	</script> 
</html>